<!-- 编辑弹窗 -->
<template>
  <div class="ele-body">
    <el-card>
      <!-- 搜索表单 -->
      <prereviceitemListSearch @search="reload"  />
    </el-card>
    <el-card>
      <ele-pro-table ref="table"  row-key="id" :columns="warehouseItemColumns"  :datasource="datasource"  :need-page="true"  show-summary :summary-method="getSummaries"  :cell-style="cellStyle" :height="tableHeight" :full-height="tableFullHeight">
        <template slot="outOrderNo" slot-scope="{ row }"  >
          <el-link  type="primary"   @click="clickbillNo(row)" >{{ row.outOrderNo }}</el-link>
        </template>
        <!-- 表头工具栏 -->
        <template slot="toolbar">
            <el-button
            v-permission="'Financial_Prerevice_Add'"
              size="small"
              type="primary"
              icon="el-icon-plus"
              class="ele-btn-icon"
              @click="openEdit({},'1')"
            >
              新增
            </el-button>
            <el-button
            v-permission="'Financial_Prerevice_Export'"
              size="small"
              icon="el-icon-upload2"
              class="ele-btn-icon"
              @click="reportexcel"
            >
              导出
            </el-button>
            <div class="ele-space" style="float: right; margin-top: 5px;">
              <div class="list-tool-item" style="margin-right: 5px;">
                <span>作废数据</span>&nbsp;
                <el-switch
                  :active-value= 1
                  :inactive-value= 0
                  v-model="isDeleted"
                  @change="editState"
                >
            </el-switch>
              </div>
              <div class="list-tool-divider" style="margin-right: 5px;">
                <el-divider direction="vertical" />
              </div>
          </div>
        </template>
        <!-- 标题列 -->
        <template slot="status" slot-scope="{ row }">
          <el-tag type="danger" v-if="row.status==1">{{ row.statusDesc }}</el-tag>
          <el-tag type="success" v-else-if="row.status==5">{{ row.statusDesc }}</el-tag>
        </template>
        <template slot="useStatus" slot-scope="{ row }">
          <el-tag type="danger" v-if="row.useStatus==0">{{ row.useStatusDesc }}</el-tag>
          <el-tag type="success" v-else-if="row.useStatus==1">{{ row.useStatusDesc }}</el-tag>
        </template>
        <template slot="action" slot-scope="{ row }"  >
          <el-link type="primary" v-permission="'Financial_Prerevice_Update'" v-if="row.useStatus==0" :underline="false"  icon="el-icon-edit" @click="openEdit(row,'2')" >修改</el-link>
          <el-popconfirm class="ele-action" v-if="row.deleted!=1 && row.useStatus==0" title="确定要作废吗？"  @confirm="remove(row)" >
            <el-link type="danger" v-permission="'Financial_Prerevice_Delete'" slot="reference" :underline="false"  icon="el-icon-delete" >作废</el-link>
          </el-popconfirm>
        </template>
      </ele-pro-table>
    </el-card>
    <!-- 编辑弹窗 -->
    <prereviceitemEdit :data="current" :visible.sync="showEdit" @done="reload" />
    <!-- 导出数据 -->
    <ExportDialog ref="ExportDialog"></ExportDialog>
  </div>
</template>
<script>

//初始化对像
import { removePageTab } from '@/utils/page-tab-util';
import ExportDialog from '@/components/Excel/ExportDialog'
import prereviceitemListSearch from './components/prereviceitem-list-search.vue';
import prereviceitemEdit from './components/prereviceitem-edit.vue';
import { QueryPrereviceitemHJByCondition,DeletePrereviceitem } from '@/api/finance/prereviceitem';
export default {
  name: 'PrereviceItemList',
  props: {
    // 弹窗是否打开
    visible: Boolean,
    // 修改回显的数据
    data: Object,
  },
  components:{prereviceitemListSearch,prereviceitemEdit,ExportDialog},
  data() {
    return {
      // 表单数据
      form: {},
      isDeleted: 0,
      amountTotal:0,
      fixedHeight:true,
      // 当前编辑数据
      current: null,
      // 是否显示编辑弹窗
      showEdit: false,
      // 提交状态
      loading: false,
      // 是否是修改
      isUpdate: false,
      // 表格列配置
      warehouseItemColumns: [
        {columnKey: 'index', type: 'index', width: 50, align: 'center', showOverflowTooltip: true, fixed: 'left', label:'序号',},
        {
          prop: 'reviceDate', label: '收款日期', showOverflowTooltip: true, align: 'center',sortable: 'reviceDate',
          formatter: (row, column, cellValue) => {return this.$util.toDateString(cellValue,"YYYY-MM-DD");}
        },
        {prop: 'customerName', label: '客户名称', showOverflowTooltip: true, align: 'center', sortable: 'customerName'},
        {prop: 'amount', label: '金额', showOverflowTooltip: true,sortable:'amount', align: 'center',},
        {prop: 'currencyDesc', label: '币种',showOverflowTooltip: true, align: 'center', sortable: 'currencyId'},
        {prop: 'bankAccountDesc', label: '银行',showOverflowTooltip: true, align: 'center', sortable: 'bankAccountId'},
        {prop: 'preNum', label: '单号',showOverflowTooltip: true,sortable:'preNum', align: 'center',},
        {prop: 'operatorName', label: '经办人', showOverflowTooltip: true, align: 'center', sortable: 'operatorName'},
        {prop: 'useStatus', label: '是否使用', showOverflowTooltip: true,  slot:'useStatus',align: 'center', sortable: 'useStatus'},
        {prop: 'status', label: '状态', slot:'status',align: 'center' },
        {columnKey: 'action', label: '操作',align: 'center',slot:'action',  width: 150,resizable: false, hideInSetting: true, showOverflowTooltip: true}
      ],
      // 导出列
      exportList: [
          { name: "收款日期", keys: "reviceDate", status: true },
          { name: "客户名称", keys: "customerName", status: true },
          { name: "金额", keys: "amount", status: true },
          { name: "币种", keys: "currencyDesc", status: true },
          { name: "银行", keys: "bankAccountDesc", status: true },
          { name: "单号", keys: "preNum", status: true },
          { name: "经办人", keys: "operatorName", status: true },
          { name: "是否使用",  keys: "useStatusDesc", status: true},
          { name: "状态", keys: "statusDesc", status: true },
        ]
  };
  },
  computed: {
      // 表格高度
      tableHeight() {
        var fh = this.fixedHeight ? 'calc(100vh - 350px)' : void 0;
        return fh;
      },
      // 表格全屏时高度
      tableFullHeight() {
        var fh =  this.fixedHeight ? 'calc(100vh - 250px)' : null;
        return fh;
      },
    },
  methods: {

    /* 表格数据源 */
    async datasource(params) {

      params.where.pageindex = params.page;
      params.where.pagesize = params.limit;

      //添加排序
      if(params.order.order == null || params.order.order == undefined){
        params.where.orderBys = [{ sort: "createDate", order: 1, }];
      }else{
        params.where.orderBys = [];
        params.where.orderBys.push({sort:params.sorter.column.sortable,order:params.order.order=='asc'?0:1});
      }

      if(!params.where.conditions) params.where.conditions = {};

      if(this.form.customerId){
        // params.where.conditions.push({
        //   key:"customerId",
        //   operator: 0,
        //   value:  this.form.customerId,
        // });
        params.where.conditions.customerId = this.where.customerId;
      }

      params.where.conditions.deleted = this.isDeleted;

      // let delIndex = params.where.conditions.findIndex((g)=>{
      //   return g.key == 'deleted';
      // })

      // if(delIndex>=0){
      //   params.where.conditions.splice(delIndex,1)
      //   params.where.conditions.push({ key:"deleted", operator: 0, value: this.isDeleted})
      // }else{
      //   params.where.conditions.push({
      //     key:"deleted",
      //     operator: 0,
      //     value: this.isDeleted,
      //   });

      //   params.where.conditions.deleted = this.isDeleted;
      // }

      let data = await QueryPrereviceitemHJByCondition(params.where);

      if(data && data.prereviceitemView){
        data.prereviceitemView.map((m)=>{
          m.grey = this.isDeleted;
        })
      }

      this.amountTotal = data.amountTotal;

      return {
          list:data.prereviceitemView,
          count:data.totalrecords,
      };
    },

    editState(){
      this.reload();
    },


   /**
   * 显示编辑
   * @param row 当前行对像
   */
    openEdit(row,index) {
      this.current = row;
      this.showEdit = true;
    },

    /* 刷新表格 */
    reload(where) {
      if(this.$refs.table){
        this.$refs.table.reload({ where: where });
      }
    },

    //单击单号
    clickbillNo(row){
      removePageTab({ key: '/businesshandling/saleoutmanager' });
      this.$nextTick(() => {
        this.$router.push({path: '/businesshandling/saleoutmanager', query: { "orderNo": row.outOrderNo } });
      });
    },

    /* 删除 */
    remove(row) {
      const loading = this.$loading({ lock: true });
      DeletePrereviceitem(row.id)
        .then((msg) => {
          loading.close();
          this.$message.success(msg);
          this.reload();
        })
        .catch((e) => {
          loading.close();
          this.$message.error(e.message);
        });
    },

    /* 导出 */
    reportexcel(pams) {
      //初始化参数
      let params = {
        pagesize: 0,
        pageindex: 1,
        conditions: [],
        orderBys: [{ sort: "createDate", order: 1, }],
      };
      //加载进度条
      const loading = this.$loading({ lock: true });
      //重新请求查询
      this.$refs.table.doRequest(({ where }) => {
      if(where){
        params.orderBys = where.orderBys;
        params.pageindex = where.pageindex;
        params.conditions = where.conditions;
      }
      //查询数据
      QueryPrereviceitemPageList(params)
        .then((data) => {
          loading.close();
          this.$refs.ExportDialog.showEdits = true
          this.$refs.ExportDialog.checkList = this.exportList
          this.$refs.ExportDialog.titleName = "预收款列表"
          this.$refs.ExportDialog.dataList = data.items;
        })
        .catch((e) => {
          loading.close();
          this.$message.error(e.message);
        });
      });
    },

     /* 合计 */
     getSummaries(param){
          const sums = [];
          sums[0] = '合计' ;
          const { columns, data } = param;
          columns.forEach((column, index) => {
            if(index ==3){
              sums[index] =  Number(this.amountTotal).toFixed(4);
            }
          });

          this.$nextTick(() => {
            this.$refs.table.doLayout();
          });
          return sums;
        },

    /* 样式 */
    cellStyle(param){
      let cellStyle;
          const { row, column, rowIndex, columnIndex } = param;
          switch(row.grey == 1){
            case true:
              cellStyle = 'background-color: RGB(240,242,245)';
              break;
            default:
              cellStyle = '';
              break;
          }
          return cellStyle;
    },
},
  
  /* 监听visible属性变化 */
  watch: {
    visible(visible) {
      if (visible) {
        //赋值this.form
        this.form = this.data;
        this.isUpdate = true;

        this.reload();
      } 
    }
  }
};
</script>